<!DOCTYPE HTML>

<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
		<meta name="author" content="myname" />
		
		<script type="text/javascript" src="scripts/jquery.js"></script>
		
		<title>TyPoker</title>
		
		<link rel="stylesheet" type="text/css" href="mystyle.css" />
		<link rel="stylesheet" type="text/css" href="mybuttons.css" />
		
		<script type="text/javascript" src="scripts/logic/array.js"></script>
		<script type="text/javascript" src="scripts/logic/data.js"></script>
		<script type="text/javascript" src="scripts/logic/card.js"></script>
		<script type="text/javascript" src="scripts/logic/deck.js"></script>
		<script type="text/javascript" src="scripts/logic/player.js"></script>
		<script type="text/javascript" src="scripts/logic/evaluator.js"></script>
      <script type="text/javascript" src="scripts/logic/engine.js"></script>
      
      <script type="text/javascript" src="scripts/ui/chat.js"></script>
		<script type="text/javascript" src="scripts/ui/myscript.js"></script>
	</head>
	
	<body>
		<div id="offline"></div>
        
		<div id="joiningPanelContainer">
			<div id="joiningPanelTd">
				<div id="joiningPanel">
					<form method="POST">
						<input id="startGame" class="button large green" type="button"	value="Start the game" />
						<input id="pickYourAvatar"	class="button large blue" type="button"
							value="Pick your avatar" />
						<input id="leaveGame" class="button large red" type="button" value="Leave the game" />
					</form>
				</div>
			</div>
		</div>
	
		<div id="pickAvatarContainer">
			<div id="pickAvatarTd">
				<div id="pickAvatar">
					<div id="avatarPositioning">
						<img class="avatarImageResize" id="avatar1"
							src="resources/avatar/avatar1.jpg" alt="Avatar1"
							onclick="selectAvatar(this.id)" />
						<img class="avatarImageResize" id="avatar2"
							src="resources/avatar/avatar2.jpg" alt="Avatar2"
							onclick="selectAvatar(this.id)" />
						<img class="avatarImageResize"	id="avatar3"
							src="resources/avatar/avatar3.jpg" alt="Avatar3"
							onclick="selectAvatar(this.id)" />
						<br />
						<br />
						<form method="POST">
							<input id="nameInput" type="text" maxlength="10" 
								value="Insert Your Nickname" />
							<br />
							<br />
							<input id="submitInfo" class="button small blue" type="button"
								value="Submit data" />
						</form>
						<br />
						<span id="infoSumbitError"></span>
					</div>
				</div>
			</div>
		</div>
        
		
		<div id="contentHolder">
			<div id="gameTableHolder">
				<div id="gameTableTd">
					<div id="gameTable">
					</div>
				</div>
			</div>
	
			<div id="bottomBar">
				<div id="chat">
					<textarea id="chatArea" readonly="readonly"></textarea>
					<form id="chatInsert" method="POST" onSubmit="return false;">
						<input id="chatInput" type="text" maxlength="160" />
						<input id="chatSubmit" class="button small green" type="button" value="Send" />
					</form>
				</div>

				<div id="buttons">
					<div id="buttonsTd">
						<form id="buttonsContainer" method="POST">
						</form>
					</div>
				</div>
	
				<div id="leaveButton">
					<div id="leaveButtonTd">
						<form method="POST">
							<input id="leaveTable" class="button large red" type="button" value="Leave" />
						</form>
					</div>
				</div>
			</div>
            <div id="gameTableVintage"></div>
		</div>
	</body>
</html>